<!DOCTYPE html>
<html lang="zh-CN">
<head>


<#include "bases/global_style.ftl">
<#include "bases/global_js.ftl">
 	    
	<script>
	
	jQuery(document).ready(function() 
	{   
		App.init();
	});

	function batchDel() {
		var index=$(".list-checkbox:checked").size();
		if(index==0){
			jAlert("未勾选要删除的对象");
		}else{
			jConfirm('确定删除该记录?', '提示', function(r) {
				 if(r==true){
					$('#postaction1').val('batchDel');
			    	$("#searchform").submit();
			     }
			});
		}
	}

	function doAddRole() {//点击添加角色
		showPopupAdd();
	}

	function doEditRole(id,name,level) {//点击编辑
		showPopupEdit(id,name,level);
	}

	function addRole() {//添加角色
		var addRoleText=document.getElementById("addRoleText").value;
		var count=true;

		resetLabel();
		if(addRoleText == null || addRoleText == "") {
			document.getElementById("addRoleText").style.borderColor = "#FF0000";
            count=false;
		}

		if (count) {
			$("#postaction3").val("insert");
			$("#addForm").submit();
		}
	}

	function updateRole() {//修改角色
		var editRoleText=document.getElementById("editRoleText").value;
		var editId=document.getElementById("editId").value;
		var count=true;

		resetLabel();
		if (editRoleText == null || editRoleText == "") {
            document.getElementById("editRoleText").style.borderColor = "#FF0000";
            count=false;
        }

		if (count) {
            $("#postaction2").val("edit");
            $("#editForm").submit();
        }
	}

	function resetLabel() {
        $("#insertdlg input").each(function(index, element)
        {
            $(this).css('borderColor','#BBB');
        });
        $("#editdlg input").each(function(index, element)
        {
            $(this).css('borderColor','#BBB');
        });
    }

	function showPopupAdd() {//弹出层(角色添加)
		var backDiv =$("#backDiv");
        backDiv.css('top','0%');
        backDiv.css('left','0%');
        backDiv.css('width','100%');
        backDiv.css('height','100%');
        backDiv.css('visibility','visible');

//        var realDiv =$("#"+div);
        var addDiv =$("#addDiv");
        addDiv.css('top','30%');
        addDiv.css('left','30%');
        addDiv.css('width','40%');
        addDiv.css('height','auto');
        addDiv.css('visibility','visible');
	}

	function showPopupEdit(id,name,level) {//弹出层(编辑角色)
		var backDiv =$("#backDiv");
        backDiv.css('top','0%');
        backDiv.css('left','0%');
        backDiv.css('width','100%');
        backDiv.css('height','100%');
        backDiv.css('visibility','visible');

        var editDiv =$("#editDiv");
        editDiv.css('top','30%');
        editDiv.css('left','30%');
        editDiv.css('width','40%');
        editDiv.css('height','auto');
        editDiv.css('visibility','visible');

        $("#editId").val(id);
        $("#editRoleText").val(name);
        $("#editRoleLevel").val(level);
	}

	function hidePopup() {//关闭层
        $("#insertdlg input").each(function(index, element)
        {
            $(this).val(null);
            $(this).css('borderColor','#BBB');
        });
        $("#editdlg input").each(function(index, element)
        {
            $(this).val(null);
            $(this).css('borderColor','#BBB');
        });

        resetLabel();
        var backDiv = document.getElementById("backDiv");
        backDiv.style.visibility = "hidden";

        var addDiv = document.getElementById("addDiv");
        addDiv.style.visibility = "hidden";

        var editDiv = document.getElementById("editDiv");
        editDiv.style.visibility = "hidden";
    }

	function allDivHide() {
        hidePopup();
    }

    function deleteRole(id,text) {//删除角色
	     jConfirm('确定删除' + text + '?', '提示', function(r) {
			  if(r==true){
		            $('#postaction1').val('delete');
		            $('#postarg').val(id);
		            $("#searchform").submit();
	            }
	     });
    }
	</script>
</head>
<!-- END HEAD -->
<!-- BEGIN BODY -->
<body>
	<!-- END HEADER -->
	
	<div id="backDiv" onclick="allDivHide()" style="position: absolute;visibility: hidden;position:fixed;overflow: hidden;solid: #000000;background-color: #000000;padding: 1px;z-index: 99;filter:alpha(opacity=50);opacity: 0.5;"></div>
	
	<!-- 添加角色 -->
	<div id="addDiv" class="row-fluid" style="position: absolute;visibility: hidden;overflow: hidden;padding: 1px;z-index: 100;background-color: #FFFFFF;">
		<div class="span12">
			<div class="portlet box green" style="padding: 0px;margin:0px;">
				<div class="portlet-title">
                    <div class="caption"><i class="fa fa-edit"></i>添加角色</div>
                    <a href="javascript:allDivHide();" class="remove"></a>
                </div>
                
                <div class="portlet-body flip-scroll">
                	<form id="addForm" action="<@spring.url '/role_list'></@spring.url>" method="POST">
                		<table class="table-bordered table-striped table-condensed flip-content">
                			<input  type="hidden" id="postaction3" name="postaction" />
                			<tbody id="insertdlg" role="alert" aria-live="polite" aria-relevant="all">
                			<tr class="even">
                            	<td style="text-align: right;">角色名称</td>
                            	<td class="even">
                                	<input class="m-wrap span8" style="margin-top: 10px" type="text" id="addRoleText" name="name" value="" placeholder="请输入角色名称" />
                            	</td>

                        	</tr>
                        	</tbody>
                        </table>
                        <div class="controls controls-row" style="text-align: right;">
                            <input type="button" value="提交" class="btn green" onclick="addRole()"/>
                            <input type="button" value="取消" class="btn green" onclick="allDivHide()" />
                        </div>
                	</form>
                </div>
			</div>
		</div>
	</div>
	
	<!-- 编辑角色 -->
	<div id="editDiv" class="row-fluid" style="position: absolute;visibility: hidden;overflow: hidden;padding: 1px;z-index: 100;background-color: #FFFFFF;">
		<div class="span12">
			<div class="portlet box green" style="padding: 0px;margin:0px;">
				<div class="portlet-title">
                    <div class="caption"><i class="fa fa-edit"></i>编辑角色</div>
                    <a href="javascript:allDivHide();" class="remove"></a>
                </div>
                
                <div class="portlet-body flip-scroll">
                	<form id="editForm" action="<@spring.url '/role_list'></@spring.url>" method="POST">
                		<table class="table-bordered table-striped table-condensed flip-content">
                		<input  type="hidden" id="postaction2" name="postaction" />
                		<input  type="hidden" id="editId" name="editid" />
                		<tbody id="editdlg" role="alert" aria-live="polite" aria-relevant="all">
                		<tr class="even">
                            <td style="text-align: right;">角色名称</td>
                            <td class="even">
                                <input class="m-wrap span8" style="margin-top: 10px" type="text" id="editRoleText" name="name" value="" placeholder="请输入角色名称" />
                            </td>
                        </tr>
     
                        </tbody>
                        </table>
                        <div class="controls controls-row" style="text-align: right;">
                            <input type="button" value="提交" class="btn green" onclick="updateRole()"/>
                            <input type="button" value="取消" class="btn green" onclick="allDivHide()" />
                        </div>
                	</form>
                </div>
			</div>
		</div>
	</div>
	
<#include "bases/navhead.ftl">
<#include "bases/sidebar.ftl">

    <div class="page-content secMenu-content">
 
        <div class="container-fluid">

                <div class="row-fluid">
                    <div class="span12">
                        <div class="portlet box green">
                            <div class="portlet-title">
                                <div class="caption"><i class="fa fa-cogs"></i>角色管理</div>
	                            <div class="tools">
	                                <a href="javascript:window.location.reload()" class="reload"></a>
	                            </div>
                            </div>
                            <div class="portlet-body flip-scroll">
                            <form id="searchform" action="<@spring.url '/role_list'></@spring.url>" method="POST">
                            	<input  type="hidden" id="postaction1" name="postaction" />
                            	<input  type="hidden" id="postarg" name="postarg" />
                            	
                            	<div class="controls controls-row">
                            		<#if role_list?exists><button type="button" class="btn green"   onclick="doAddRole()"><i class="fa fa-plus"></i>添加角色</button></#if>
                            		<#if role_list?exists><button type="button" class="btn blue"  style="margin-left: 20px" onclick="batchDel()">批量删除</button></#if>
                            	</div>
                            	
                            	  <table  class="table table-bordered table-hover table-striped table-condensed list-table">
	      						   <thead class="flip-content">
	        						<tr>
	          						  <th><input type="checkbox" class="checkbox-length list-checkboxAll"></th>
	          						  <th style="text-align: center;">角色名称</th>
	          						  <th style="text-align: center;">操作</th>
	        						</tr>
	      						  </thead>
	      						  <tbody>
	      						  <#list role_list as rl>
	      						  	<tr>
	      						  	  <#if rl?exists>
	          						  <th>
	          						     <input value="${rl.getId()}" name="checklist" type="checkbox" class="list-checkbox">
	          						  </th>
	          						  <td style="text-align: center;">${rl.getName()}</td>
	          						  <td class="list-action" style="text-align: center;">
		          							<a href="javascript:doEditRole(${rl.getId()},'${rl.getName()}',${rl.getLevel()});">编辑</a>
		          							<a href="javascript:deleteRole(${rl.getId()},'${rl.getName()}');" class="delTr">删除</a>
	          						  </td>
	          						  </#if>
	        						</tr>
	      						  </#list>
	      						  	  </tbody>
	      						</table>
                            </form>
                            </div>
                        </div>
                    </div>
                </div>
                
            </div>
            
        </div>
 
 
</body>
</html>